<template>
  <div>
    <div v-if="this.list.length == 0">
      <br />
      <!-- <van-image fit="scale-down" :src="require('../images/暂无数据.png')" /> -->
      <van-empty
        hairline
        :description="'未查找到你所需的' + '*' + this.file + '*'"
        image="search"
      />
      <div class="btn">
        <van-button type="default" size="mini" to="index"
          >点我回首页</van-button
        >
      </div>
    </div>
    <ul v-else-if="this.list != ''">
      <li v-for="(i, ind) in list" :key="ind" type="flex">
        <div class="left">
          <van-image contain class="img" :src="list[ind].titlepic" />
        </div>
        <!-- <p>{{list[ind].titlepic}}</p> -->
        <div class="right">
          <h5>{{ list[ind].title }}</h5>
          <span class="section">{{ list[ind].desc }}</span>
          <h4 class="h4">
            <span class="small">￥</span>{{ list[ind].pprice }}
          </h4>
          <span class="small_span">{{ list[ind].comment_num + "条评论" }}</span
          >&nbsp;<span class="small_span">{{
            list[ind].good_num + "满意"
          }}</span>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "VantXiaomi",

  data() {
    return {
      isShow: true,
    };
  },
  props: {
    list: {
      template: "#xiaomi",
    },
    img: {
      template: "#xiaomi",
    },
    file: {
      type: String,
    },
  },
  mounted() {},

  methods: {},
};
</script>

<style scoped>
* {
  padding: 0;
  margin: 0;
}
li {
  float: left;
  box-sizing: border-box;
}
h5 {
  font-size: 18px;
}
.h4 {
  color: rgb(255, 102, 0);
}
span {
  font-size: 16px;
}
.section {
  display: block;
  height: 60px;
  font-size: 13px;
  color: rgb(194, 191, 189);
  margin-top: 5px;
}
.van-image {
  padding: 0.266667rem 0.133333rem;
  /*     
    width: 100px;
    height: 100px; */
}
.left {
  width: 40%;
  float: left;
}
.right {
  padding: 10px;
  box-sizing: border-box;
  width: 60%;
  float: left;
}
.small_span {
  font-size: 14px;
  color: rgb(178, 178, 178);
}
.btn {
  width: 100%;
  text-align: center;
}
.btn .van-button {
  color: #aaa;
  padding: 0 10px;
}
.btn .van-button:active {
  color: #78959e;
}
.van-button__text {
  font-size: 14px;
}
</style>